// import DocViewer, { DocViewerRenderers } from "@cyntler/react-doc-viewer"
// import "@cyntler/react-doc-viewer/dist/index.css";
import { useSearchParams } from 'react-router-dom'
import {Image} from "antd";
import FileViewer from "react-file-viewer";

const View = () => {
    const [searchParams] = useSearchParams()
    const fileName: string | null = searchParams.get('fileName') as string
    const path: string | null = searchParams.get('path') as string
    return (
        <div style={{ width: '100vw', height: '100vh' }}>
            { fileName && path && (import.meta.env.VITE_ACCEPT_IMAGE as string).includes((fileName as string).split('.').pop() as string) ? <div style={{ height: '100vh', display: 'flex', justifyContent: 'center', alignItems: 'center' }}><Image src={`/api${path}`} /></div> : null }
            { fileName && path && (fileName.split('.').pop() as string).toUpperCase() === 'PDF' ? <iframe src={`${import.meta.env.VITE_BASE_URL + path}`} width='100%' height='100%'/> : null}
            { fileName && path && !((import.meta.env.VITE_ACCEPT_IMAGE as string).includes((fileName as string).split('.').pop() as string) || (fileName.split('.').pop() as string).toUpperCase() === 'PDF') ? <FileViewer fileType={fileName.split('.').pop() as string} filePath={`/api${path}`}/> : null }
            {/*<DocViewer documents={[{ uri: `http://localhost:5173/api/file/ea3bdb95-c943-4b27-807c-f3c834d837c1.docx` }]} pluginRenderers={DocViewerRenderers} />*/}
        </div>
    )
}

export default View